Skip to content

Conversation

AidanLDev
Copy link
Contributor

Summary

Fixes #45051 - Fixed logical error in top-level-imports codemod that was incorrectly transforming color imports.

Description

The v5.0.0/top-level-imports codemod was incorrectly transforming imports from @mui/material/colors (e.g., import { grey } from '@mui/material/colors') to @mui/material (e.g., import { grey } from '@mui/material'). This transformation is invalid because color exports like grey, blue, etc. are not available from the main @mui/material package.

Root Cause

The issue was in the whitelist check condition:

// Before (buggy)
if (!whitelist.has(specifier.imported.name) == null && ...)

// After (fixed) 
if (!whitelist.has(specifier.imported.name) && ...)

@zannager zannager added the package: codemod Specific to codemod. label Jun 23, 2025
@zannager zannager requested a review from DiegoAndai June 23, 2025 15:34
Copy link
Member

@DiegoAndai DiegoAndai left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for submitting this @AidanLDev! The fix seems correct and the tests as well.

May I ask you to move the expected input and output test content to separate files? Similar to how it's done for other tests. You can create separate files for this test in particular, or add it to the existing files.

@AidanLDev
Copy link
Contributor Author

Good point, I will update the tests to follow the same style as the other ones :)

ClickAwayListener,
ListSubheader,
} from '@mui/material';
import { createTheme } from '@mui/material/styles';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is createTheme moved? Is createTheme not included on the whitelist?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good question, that's right it's not currently in the whitelist so to get the tests passing I moved it outside of the @mui/material import.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@siriwatknp do you know if this is correct?

Copy link
Member

@ZeeshanTamboli ZeeshanTamboli Jul 29, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is correct. The reason it should be moved outside of the direct @mui/material root import is because in the actual.js file it is imported from the styles folder:

import { createTheme } from '@mui/material/styles';

And ThemeProvider is imported directly:

import { ThemeProvider } from '@mui/material';

So, it should be the same in the expected.js file and should not transform the imports because they are not in the whitelist.

To make it consistent with createTheme, I moved ThemeProvider to be imported from styles folder in actual.js file.


Before this bugfix, it was also transforming imports from @mui/material/styles which was incorrect. If it is imported from @mui/material/styles, it should keep it as is and if it is imported from @mui/material it should keep it as is for createTheme and ThemeProvider APIs.

@mui-bot
Copy link

mui-bot commented Jul 28, 2025

Netlify deploy preview

https://deploy-preview-46405--material-ui.netlify.app/

Bundle size report

Bundle Parsed Size Gzip Size
@mui/material 0B(0.00%) 0B(0.00%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 342ae25

@ZeeshanTamboli ZeeshanTamboli changed the title Fix/codemod top level imports 45051 [codemod] Fix v5 top level imports changing color imports Jul 28, 2025
@ZeeshanTamboli ZeeshanTamboli changed the title [codemod] Fix v5 top level imports changing color imports [codemod] Fix v5 top-level-imports changing color imports Jul 28, 2025
@ZeeshanTamboli ZeeshanTamboli added type: bug It doesn't behave as expected. v5.x labels Jul 28, 2025
Copy link
Member

@ZeeshanTamboli ZeeshanTamboli left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@AidanLDev Looks good! Thanks for the fix.

@ZeeshanTamboli ZeeshanTamboli changed the title [codemod] Fix v5 top-level-imports changing color imports [codemod] Fix v5.0.0/top-level-imports codemod changing color imports Jul 29, 2025
@ZeeshanTamboli ZeeshanTamboli merged commit 03b126d into mui:master Jul 29, 2025
20 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: codemod Specific to codemod. type: bug It doesn't behave as expected. v5.x

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[codemod] v5 top-level-imports changing color imports

5 participants